import React, { useState } from 'react';
import "../styles/Login.scss"
import { staff_login } from "../utils/api"
import { Form, Input, Button, Select, notification } from 'antd'
import { useNavigate } from 'react-router-dom'

interface Props {

}

function Login(props: Props) {

    var navigate = useNavigate()
    const onFinish = (values: any) => {

        //发起 登录请求
        staff_login({ phone: values.user, pass: values.pass }).then((res) => {
            if (res.data.code == 200) {
                notification.success({ message: '登录成功!', placement: "top" });

                localStorage.setItem("token", res.data.token);
                localStorage.setItem("userinfo", JSON.stringify(res.data.userInfo))
                navigate("/index/home")
            }
            else {
                notification.success({ message: '登录失败!', placement: "top" });

            }
        })
    };
    return (
        <div className='login'>
            <div className="form-box">
                <Form
                    labelCol={{ span: 6 }}
                    wrapperCol={{ span: 18 }}
                    onFinish={onFinish}
                >
                    <Form.Item
                        label="账号"
                        name="user"
                        rules={[{ required: true, message: '输入账号' }]}
                    >
                        <Input placeholder='输入账号' />
                    </Form.Item>
                    <Form.Item
                        label="密码"
                        name="pass"
                        rules={[{ required: true, message: '输入密码' }]}
                    >
                        <Input.Password placeholder='输入密码' />
                    </Form.Item>
                    <Form.Item wrapperCol={{ offset: 8, span: 16 }}>
                        <Button type="primary" htmlType="submit">登录</Button>
                    </Form.Item>
                </Form>
            </div>
        </div>


    )

}
export default Login;